<template>
  <page class="product-execu-firstcheck">
    <div v-show="mqVisible === 1">
      <p-table
        :columns="columns"
        :data-source="dataSource"
        :pagination="pagination"
        row-key="id"
        size="middle"
        bordered
      >
        <template slot="inspectBillno" slot-scope="text, record">
          <a href="javascript:;" @click="toDetail(record)">{{ text }}</a>
        </template>
        <template slot="inspectStatus" slot-scope="text">
          <p-tag v-if="text === 1"  color="blue" ><p-icon type="clock-circle" />待检</p-tag>
          <p-tag v-else-if="text === 2" color="orange" ><p-icon type="exclamation-circle" />待线长确认</p-tag>
          <p-tag v-else-if="text === 3" color="orange" ><p-icon type="exclamation-circle" />待IPQC复核</p-tag>
          <p-tag v-else-if="text === 4" color="green" ><p-icon type="check-circle" />检验完成</p-tag>
        </template>
        <template slot="inspectResult" slot-scope="text">
          <p-tag v-if="text === 1" color="green"><p-icon type="check-circle" />合格</p-tag>
          <p-tag v-if="text === 2" color="red"><p-icon type="close-circle" />不合格</p-tag>
        </template>
      </p-table>
    </div>

    <component
      v-if="currentView && mqVisible !== 1"
      :is="currentView"
      :mqVisible.sync="mqVisible"
      :mqLoad.sync="mqLoad"
      :mqData.sync="mqData"
    />
  </page>
</template>

<script>
import mixins from './info-mixins'
import firstCheckMixins from './first-check-mixins'
import { getAction } from '@/api/manage'
import { isEmpty } from '@/utils/util'

export default {
  mixins: [mixins, firstCheckMixins],
  data() {
    return {
      loading: false,
      dataSource: [],
      pagination: {
        current: 1,
        pageSize: 10,
        limit: 10,
        pageSizeOptions: ['10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
        onChange: current => {
          this.pagination.current= current
          this.getData()
        },
        onShowSizeChange: (current, pageSize) => {
          this.pagination.pageSize = pageSize
          this.getData()
        }
      },
      columns: [
        {
          title: '序号',
          dataIndex: 'rowIndex',
          align: 'center',
          width: 45,
          customRender(text, record, index) {
            return index + 1
          }
        },
        {
            title: '送检单号',
            dataIndex: 'inspectBillno',
            align: 'center',
            scopedSlots: {
              customRender: 'inspectBillno'
            }
        },
        {
            title: '车间',
            dataIndex: 'workroomname',
            align: 'center',
        },
        // {
        //     title: '二级工序',
        //     dataIndex: 'processTwo',
        //     align: 'center',
        // },
        // {
        //     title: '线体',
        //     dataIndex: 'linename',
        //     align: 'center',
        // },
        {
            title: '生产工单',
            dataIndex: 'productionBillno',
            align: 'center',
        },
        {
            title: '工序工单',
            dataIndex: 'processBillno',
            align: 'center',
        },
        {
            title: '检验状态',
            dataIndex: 'inspectStatus',
            align: 'center',
            scopedSlots: {
              customRender: 'inspectStatus'
            }
        },
        {
            title: '检验结果',
            dataIndex: 'inspectResult',
            align: 'center',
            scopedSlots: {
              customRender: 'inspectResult'
            }
        }
      ],
    }
  },
  watch: {
    options: {
      deep: true,
      handler() {
        this.pagination.current = 1
        this.getData()
      }
    },
    mqVisible(val) {
      val === 1 && this.getData()
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    getData() {
      if (!this.options.processTwoCode) {
        this.dataSource = []
        this.pagination.total = 0
        return
      }
      const params = {
        limit: this.pagination.pageSize,
        pageNo: this.pagination.current,
        processTwoCode: this.options.processTwoCode
      }
      getAction('/mes-quality/mesQcInspectTask/list', params).then(res => {
        this.dataSource = res.data.records || []
        this.pagination.total = res.data.total || 0
      })
    },
  }
}
</script>

<style lang="less">
.product-execu-firstcheck {
  .table-page-search-wrapper {
    .poros-form-item {
      > .poros-form-item-label {
        width: 78px;
        text-align: right;
      }
    }
  }
}
</style>